<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Back Top</title>
  <link rel="stylesheet" href="../dist/aqua.css" />
  <link rel="stylesheet" href="./styles/demo.css" />
  <link rel="stylesheet" href="./styles/backtop.css" />
</head>

<body>
  <section class="masthead" role="img" aria-label="Image Description" id="top">
    <h1>
      Pure CSS Back To Top
    </h1>
    <button class="btn btn-primary">
      Scroll Down to See the Magic
    </button>
  </section>
  <article>
    <div class="back-top">
      <a href="#top" class="chevron-icon up circle back-top-link"></a>
    </div>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Laoreet non curabitur gravida arcu ac tortor. Metus dictum at tempor commodo ullamcorper. Blandit massa enim nec dui nunc mattis enim ut. Vitae suscipit tellus mauris a diam maecenas. Vel facilisis volutpat est velit. Montes nascetur ridiculus mus mauris vitae. Eu feugiat pretium nibh ipsum consequat nisl. Enim tortor at auctor urna. Nibh nisl condimentum id venenatis a condimentum. Varius sit amet mattis vulputate.</p>
    <p>Eu non diam phasellus vestibulum lorem. Sed tempus urna et pharetra. Vel pretium lectus quam id. Nullam non nisi est sit amet facilisis magna etiam. Vitae semper quis lectus nulla at. Commodo nulla facilisi nullam vehicula ipsum a. Tristique sollicitudin nibh sit amet commodo. Ultrices mi tempus imperdiet nulla. A condimentum vitae sapien pellentesque habitant morbi. Mi eget mauris pharetra et.</p>
    <p>Ac tortor dignissim convallis aenean et tortor at. Pulvinar pellentesque habitant morbi tristique senectus. Sed pulvinar proin gravida hendrerit lectus a. Maecenas accumsan lacus vel facilisis volutpat. Suspendisse faucibus interdum posuere lorem ipsum dolor sit. Vitae justo eget magna fermentum iaculis eu non diam. Dis parturient montes nascetur ridiculus mus mauris vitae. Amet commodo nulla facilisi nullam vehicula ipsum a arcu. A lacus vestibulum sed arcu. Lectus sit amet est placerat in egestas erat imperdiet. Parturient montes nascetur ridiculus mus mauris vitae ultricies. Penatibus et magnis dis parturient montes nascetur ridiculus mus. Arcu cursus vitae congue mauris. Elementum pulvinar etiam non quam lacus. Est pellentesque elit ullamcorper dignissim. Quis imperdiet massa tincidunt nunc pulvinar. In hendrerit gravida rutrum quisque non.</p>
    <p>Interdum velit laoreet id donec ultrices tincidunt arcu non. Cursus in hac habitasse platea dictumst quisque sagittis purus. Purus viverra accumsan in nisl nisi. Nulla porttitor massa id neque aliquam. Donec pretium vulputate sapien nec sagittis aliquam malesuada. Mauris ultrices eros in cursus turpis massa tincidunt dui ut. Etiam erat velit scelerisque in dictum non consectetur a. Faucibus in ornare quam viverra orci sagittis. Montes nascetur ridiculus mus mauris vitae ultricies leo. Neque sodales ut etiam sit amet nisl. Eu ultrices vitae auctor eu augue ut lectus arcu bibendum. Egestas sed sed risus pretium quam. Lobortis feugiat vivamus at augue eget arcu dictum. Amet mattis vulputate enim nulla aliquet porttitor lacus. Proin libero nunc consequat interdum varius. Viverra aliquet eget sit amet. Sit amet est placerat in egestas erat imperdiet. Eget nunc lobortis mattis aliquam faucibus purus in massa tempor. At consectetur lorem donec massa. Pharetra diam sit amet nisl suscipit adipiscing bibendum est.</p>
    <p>Amet mauris commodo quis imperdiet massa tincidunt. Quam nulla porttitor massa id neque. Pellentesque diam volutpat commodo sed egestas egestas fringilla. Ac auctor augue mauris augue neque gravida in. Et malesuada fames ac turpis egestas maecenas. Pretium fusce id velit ut tortor pretium. Sagittis aliquam malesuada bibendum arcu vitae elementum curabitur vitae nunc. Ligula ullamcorper malesuada proin libero nunc. Pharetra magna ac placerat vestibulum lectus. Neque vitae tempus quam pellentesque nec nam aliquam sem et. Cursus euismod quis viverra nibh cras pulvinar. Sed tempus urna et pharetra pharetra massa. Sed lectus vestibulum mattis ullamcorper velit sed. Hac habitasse platea dictumst quisque sagittis purus sit. Tellus in metus vulputate eu scelerisque.</p>
  </article>
</body>

</html>